<%--
  Created by IntelliJ IDEA.
  User: pc
  Date: 2017/11/15
  Time: 20:00
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head></head>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<body>
<div>
    <div id="caty"></div>
    <table id="datas">
        <tr>
            <td>id</td>
            <td>name</td>
            <td>内容</td>
            <td>状态</td>
            <td>cretaetime</td>
            <td>createdate</td>
        </tr>
    </table>
    <div id="adto"></div>
    <div id="upfile"> </div>
    <div id="downfile"></div>
</div>
</body>
<script>
    $(function () {
        getAlLCatgy();
    });
    //查询所有类别
    function getAlLCatgy() {
        $.post("/detal/getAllCategory.do",function (data) {
            $.each(data, function (i,n) {
                var row = $('<tr id="cat">'+
                    '<td class="cname"></td>' +
                    '</tr>');
                row.find(".cname").html("<input type='button' value='"+n.cname+"' id='catrgory"+n.cid+"'/>");
                row.appendTo("#caty");
                ctgry(n.cid);
            });
        },"json");

    }
    //类别点击事件
    function ctgry(cid) {
        $("#catrgory"+cid+"").click(function () {
            $("#upfile").empty();
            $("#downfile").empty();
            $("#datas").empty();
            $("#adto").empty();
            var row=$("<tr>"+
                "<td>id</td>"+
                "<td>name</td>"+
                "<td>内容</td>"+
                "<td>状态</td>"+
                "<td>cretaetime</td>"+
                "<td>createdate</td>"+
                "</tr>");
            var row2=$(
            "<p>=======================新增=======================</p>"+
            "name：<input type='text' id='dname'/>"+
            "<br/><br/>"+
            "内容：<textarea name='eduhistory' cols='30' rows='3' align='center' id='con'></textarea>"+
            "<input type='button' value='提交' onclick='add("+cid+")'/>");
            row.appendTo("#datas");
            row2.appendTo("#adto");
            getAllDetal(cid);
        });
    }
    //查询该用户所有事项根据用户id和类别id
    function getAllDetal(cid) {
        $.post("/detal/getAllDetal.do",{cid:cid},function (data) {
            $.each(data, function (i,n) {
                addTr(n);
            });
        },"json");
    }
    function addTr(n){
        var row = $(
            '<tr id="root">'+
            '<td class="id"></td>'+
            '<td class="name"></td>'+
            '<td class="contex"></td>'+
            '<td class="state">' +
            '<select name="st" disabled="true">'+
            '<option value="0">待办</option>'+
            '<option value="1">已办</option>'+
            '</select>'+
            '</td>'+
            '<td class="createtime"></td>'+
            '<td class="createdate"></td>'+
            '</tr>');
        row.attr("id","root"+n.id);
        row.find(".id").text(n.id);
        row.find(".name").text(n.dname);
        row.find(".contex").text(n.content);
        row.find(".state select").val(n.state);
        row.find(".createtime").text(n.createtime);
        row.find(".createdate").text(n.createdate);
        row.append("<a href='#' onclick=del("+n.id+",this)>删除</a>&nbsp;&nbsp;" +
            "<a href='#' class='up' onclick=update(this) )>修改</a>&nbsp;&nbsp;" +
            "<a href='#' onclick=upfe("+n.id+","+n.isfile+")>上传附件</a>&nbsp;&nbsp;" +
            "<a href='#' onclick=down("+n.id+","+n.isfile+")>获取附件</a>" );
        row.appendTo("#datas");
    }
    //添加事项
    function add(cid) {
        $.post("/detal/addDatal.do",{dname:$("#dname").val(),content:$('#con').val(),cid:cid},function (data) {
            addTr(data);
        },"json")
    }
    //删除事项
    function del(id,dom){
        $.post("/detal/detalDetal.do",{id:id},function(data){
            if(data==1){
                alert("成功");
                $("#root"+id).remove();
            }
        });
    };
    //修改事项
    function update(data) {
        var dname=$(data).parent().children(".name");
        dname.html("<input class='dtname' value='"+dname.text()+"'/>");
        var dcon=$(data).parent().children(".contex");
        dcon.html("<textarea name='dtcon' cols='30' rows='3' align='center'class='contex'>"+dcon.text()+"</textarea>");
        $(data).parent().children(".state").children().attr("disabled",false);
        $(data).parent().children(".up").text("确定").attr("onclick","bc(this)");
    }
    function bc(data){
        var dtname=$(data).parent().children(".name");
        var dtcon=$(data).parent().children(".contex");
        var dtsta=$(data).parent().children(".state").children();
        var did=$(data).parent().children(".id");
        var up= $(data).parent().children(".up");
        $.post("/detal/updateDetal.do",{dname:dtname.children().val(),content:dtcon.children().val(),state:dtsta.val(),id:did.text()},function(data2){
            if(data2!=null){
                $(dtname.children()).remove();
                $(dtcon.children()).remove();
                up.text("修改").attr("onclick","update(this)");
                dtsta.attr("disabled",true);
                dtname.text(data2.dname);
                dtcon.text(data2.content);
            }else{
                alert("失败")
            }
        },"json");
    }
    //上传附件
    function upfe(did,isfile) {
        $("#downfile").empty();
        $("#upfile").empty();
        var row=$("<p>===============上传附件===================</p>"+
            "<form name='fileup' action='/file/Upload.do?did="+did+"&isfile="+isfile+"'  method='post'  enctype='multipart/form-data'target='frameFile'>"+
            "<input type='file' name='file'>"+
            "<input type='submit' onclick='' value='上传附件'/>"+
            "</form>" +
            "<iframe name='frameFile' style='display: none;'></iframe>");
        row.appendTo("#upfile");
    }
    //下载附件
    function down(did,isfile) {
        $("#upfile").empty();
        $("#downfile").empty();
        if(isfile==1){
            $.post("/file/getByDid.do",{did:did},function (data) {
                $.each(data, function (i,n) {
                    var row=$("<p>===============获取附件===================</p>" +
                        "<a href='/file/down.do?fileName="+n.ename+"'>"+n.ename+"</a>");
                    row.appendTo("#downfile");
                });
            },"json");
        }else{
            var row=$("<p>===============获取附件===================</p>" +
                "<h4>无附件</h4>");
            row.appendTo("#downfile");
        }
    }
</script>